<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>新品有戏后台管理</title>
    <script src="__JS__/jquery.js"></script>
    <link href="__CSS__/boot.css" rel="stylesheet">
    <link href="__STATIC__/layui/css/layui.css" rel="stylesheet">
    <script src="__JS__/layer/layer.js"></script>
    <script src="__STATIC__/layui/layui.js"></script>
    <style>
        th{
            text-align: center;
            vertical-align: middle!important;
        }
    </style>
</head>
<body>
{include file="base/header" /}
<br/>
<center>
    <form name="myform" onsubmit="return false" class="layui-form">
        <input type="hidden" name="sid" value="{$sid}"/>
        条形码：<input type="text" name="barcode" id = "compute" onchange="sub()"/><br/>
        <div id="table" style="width: 600px;margin: 0 auto;">

        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="radio" name="payment" value="支付宝" title="支付宝">
                <input type="radio" name="payment" value="微信" title="微信" >
                <input type="radio" name="payment" value="现金" title="现金" >
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <input type="radio" name="payment" value="支付宝" title="支付宝">
            </div>
        </div>
        <input type="button" class="btn btn-primary  btn-xs" onclick="compute()" value="总金额"/>：<input type="text" id="tal" value="" style="border: 0px" readonly/>
        <input type="button" class="btn btn-primary  btn-xs" onclick="settlement()" value="结账">
    </form>
</center>
</body>
<script>
    layui.use('form', function(){
        var form = layui.form;
    });
</script>
<script>
    //存储产品信息
    total = [];
    /**
     * 查询产品信息
     * */
    function sub() {
        var barcode = $("input[name=barcode]").val();
        if(ifArrVal(total,barcode)){
            $("input[name=barcode]").val("");
            for(var i=0;i<total.length;i++){
                if(contains(total[i],barcode)){
                    total[i][2] = Number(total[i][2]) + 1;
                    total[i][6] = Number(total[i][1]) + Number(total[i][6]);
                    $("#"+total[i][3]+"").val(total[i][2])
                }
            }
            compute();
        }else{
            $.ajax({
                url:"{:url('index/orders/barcode')}",
                type:"post",
                data:"barcode="+barcode,
                dataType:"json",
                success:function (data) {
                    if(data.error){
                        layer.alert('商品不存在');
                        return;
                    }
                    var table = "<table width='500px' class=\"layui-table\" border='1px solid #F00' id='"+data.id+"'>";
                    table +='<tr><td>商品名称</td><td>'+data.pname+'</td></tr>';
                    table +='<tr><td>单价</td><td><input type="text" readonly id='+data.id+' name="number" style="border: 0px;" value='+data.retailprice+'元></td></tr>';
                    table +='<tr><td>图片</td><td><img src=__ROOT__\\'+data.image+' width="100" height="100"></td></tr>';
                    table +='<tr><td>购买数量</td><td><input id='+data.id+' type="button" onclick="plus(this)" class="btn btn-info btn-xs"  style="width: 20px;" value="+"/><input type="text" style="text-align: center;border: 0px;" id='+data.barcode+' value="1" onchange="change(this)" size="1"/><input type="button" class="btn btn-info btn-xs" id='+data.id+' onclick="reduce(this)" style="width: 20px;" value="-"/></td></tr>';
                    table +='<tr><td>删除</td><td><input class="btn btn-danger btn-xs" type="button" style="float: right;" value="删除" onclick="del(this)" id='+data.id+'></td></tr>';
                    table +="</table>";
                    $(table).appendTo("#table");
                    $("input[name='barcode']").val("");
                    var ls = [];
                    var subtotal = data.retailprice;
                    ls.push(data.id);
                    ls.push(data.retailprice);
                    ls.push(Number($("#"+data.barcode+"").val()));
                    ls.push(data.barcode);
                    ls.push(data.pname);
                    ls.push(data.image);
                    ls.push(subtotal);
                    total.push(ls);
                    compute();
                }
            });
        }
        console.log(total);

    }
    /**
     * 购买数量加1
     * */
    function plus(num) {
        var id = Number(num.id);
        if(ifArrVal(total,id)){
            for(var i=0;i<total.length;i++){
                if(contains(total[i],id)){
                    total[i][6] = Number(total[i][1]) + Number(total[i][6]);
                    total[i][2] = Number(total[i][2]) +1;
                    var n = Number($("#"+total[i][3]+"").val())+1;
                    $("#"+total[i][3]+"").val(n);
                    console.log(total[i]);
                }
            }
        }
        compute();
    }

    /**
     * 购买数量减1
     * */
    function reduce(num) {
        var id = Number(num.id);
        if(ifArrVal(total,id)){
            for(var i=0;i<total.length;i++){
                if(contains(total[i],id)){
                    if(total[i][2]>1){
                        total[i][6] = Number(total[i][6]) - Number(total[i][1]);
                        total[i][2] = Number(total[i][2]) - 1;
                        var n = Number($("#"+total[i][3]+"").val())-1;
                        $("#"+total[i][3]+"").val(n);
                    }else{
                        total[i][2] = 1;
                    }
                    console.log(total[i]);
                }
            }
        }
        compute();
    }

    /**
     * 改变数量
     * */
    function change(code) {
        var barcode = code.id;
        if(ifArrVal(total,barcode)){
            for (var i=0;i<total.length;i++){
                if(contains(total[i],barcode)){
                    var number = Number($("#"+barcode+"").val());
                    total[i][6] = total[i][1] * number;
                    total[i][2] = number;
                }
            }
        }
        compute();
    }
    /**
     * 总计
     * */
    function compute() {
        var count = 0;
        for(var i=0;i<total.length;i++){
            count = count + total[i][6];
        }
        $("#tal").val(count+"元");
    }

    /**
     * 删除某个商品
     * */
    function del(bnt) {
        for(var i=0;i<total.length;i++){
            if(contains(total[i],Number(bnt.id))){
                total.splice(i,1);
                $("#"+bnt.id+"").remove();
            }
        }
        compute();
    }
    /**
     * 结算
     * */
    function settlement() {
        var sid = $("input[name=sid]").val();
        var paymethod = $("input[name=payment]:checked").val();
        if(!paymethod){
            layer.msg('请选择支付方式',{icon:1,time:2000});
            return ;
        }
        $.ajax({
            url:"{:url('index/orders/settlement')}",
            data:"total="+arrayToJson(total)+"&sid="+sid+"&paymenthod="+paymethod,
            type:"post",
            dataType:"json",
            success:function (data) {
                if(data.success){
                    layer.alert(data.success,{bnt:['确定','取消']},
                        function () {
                            window.location.reload();
                        },function () {
                            window.location.reload();
                        }
                    );
                }
                if(data.error){
                    layer.alert(data.error);
                }
            }
        });
    }
    /**
     * 判断某个数是否在多维数组中
     */
    function ifArrVal(arr,value){
        //多维数组判断是否存在某值
        for(var i = 0;i < arr.length;i++){
            //判断是否为多维数组
            if(arr[i] instanceof Array){
                if(jQuery.inArray( value, arr[i] )!=-1){
                    return true;
                }
            }
        }
        //不存在
        return false;
    }

    /**
     *  判断某个值是否在数组中
     */
    function contains(arr, obj) {
        //数组的长度
        var i = arr.length;
        while (i--) {
            if (arr[i] === obj) {
                //存在
                return true;
            }
        }
        //不存在
        return false;
    }
    /**
     * 将二维数组转为 json 字符串
     */
    function arrayToJson(o) {
        var r = [];
        if (typeof o == "string") return "\"" + o.replace(/([\'\"\\])/g, "\\$1").replace(/(\n)/g, "\\n").replace(/(\r)/g, "\\r").replace(/(\t)/g, "\\t") + "\"";
        if (typeof o == "object") {
            if (!o.sort) {
                for (var i in o)
                    r.push(i + ":" + arrayToJson(o[i]));
                if (!!document.all && !/^\n?function\s*toString\(\)\s*\{\n?\s*\[native code\]\n?\s*\}\n?\s*$/.test(o.toString)) {
                    r.push("toString:" + o.toString.toString());
                }
                r = "{" + r.join() + "}";
            } else {
                for (var i = 0; i < o.length; i++) {
                    r.push(arrayToJson(o[i]));
                }
                r = "[" + r.join() + "]";
            }
            return r;
        }
        return o.toString();
    }
</script>
</html>